var FormMemberEdit = function () {
	return {
		validate: function(form){
			$(form).validate(
				{
					errorElement: 'span', //default input error message container
					errorClass: 'help-inline', // default input error message class
					focusInvalid: false, // do not focus the last invalid input
					ignore: "",
					highlight: function (element) { // hightlight error inputs
						$(element)
							.closest('.help-inline').removeClass('ok'); // display OK icon
						$(element)
							.closest('.control-group').removeClass('success').addClass('error'); // set error class to the control group
					},

					unhighlight: function (element) { // revert the change dony by hightlight
						$(element)
							.closest('.control-group').removeClass('error'); // set error class to the control group
					},

					success: function (label) {
						label
							.addClass('valid').addClass('help-inline ok') // mark the current input as valid and display OK icon
						.closest('.control-group').removeClass('error').addClass('success'); // set success class to the control group
					}
				}
			);
		},
		
		sendData: function(form){
			$.ajax({
				url: $(form).attr("action"),
				data : $(form).serialize(),
				beforeSend: function(){
					var el = jQuery("body");
					App.blockUI(el);
				},
				success: function(respon) {
				
					var el = jQuery("body");
					App.unblockUI(el);
					
					try {
						var obj = jQuery.parseJSON(respon);
						
						if(obj.status == "success"){
							$.gritter.add({
								title: 'Success',
								text: obj.msg
							});
						}else if(obj.status == "error"){
							var type = typeof obj.msg;
							if (type == "object"){
								$.each(obj.msg, function(i, dt) {
									$("#"+dt.id)
										.closest('.help-inline').removeClass('ok');
									$("#"+dt.id)
										.closest('.control-group').removeClass('success').addClass('error'); // set error class to the control group
									$("#"+dt.id).parent().children(".help-inline").text(dt.text);
								})
							}else if (type == "string"){
								$.gritter.add({
									title: 'Error',
									text: obj.msg
								});
							}
						}
						
						return false;
					} catch (e) {
						// error
						$.gritter.add({
							title: 'Error',
							text: e
						});
						return false;
					}
				},
				type: "post",
				dataType: "html"
			});
		},
		
		ajaxSubmit: function(form){
			$(form).submit(function(){
				if($(this).valid()){
					FormMemberEdit.sendData(this);
				}
				return false;
			})
		},
		
		//main function to initiate the module
		init: function () {
			FormMemberEdit.validate("#form-account");
			FormMemberEdit.ajaxSubmit("#form-account");
			
			FormMemberEdit.validate("#form-password");
			FormMemberEdit.ajaxSubmit("#form-password");
			
			FormMemberEdit.validate("#form-profile");
			FormMemberEdit.ajaxSubmit("#form-profile");
			
			FormMemberEdit.validate("#form-address");
			FormMemberEdit.ajaxSubmit("#form-address");
			
			FormMemberEdit.validate("#form-contact");
			FormMemberEdit.ajaxSubmit("#form-contact");
			
			FormMemberEdit.validate("#form-primary-office");
			FormMemberEdit.ajaxSubmit("#form-primary-office");
			
			for(var i=1;i<4;i++){
				FormMemberEdit.validate("#form-secondary-office-"+i);
				FormMemberEdit.ajaxSubmit("#form-secondary-office-"+i);
			}
			
			FormMemberEdit.validate("#form-organization");
			FormMemberEdit.ajaxSubmit("#form-organization");
			
			$(".select2").select2();
			$('#btn-date').datepicker()
				.on('show', function(ev){
					var date = $("#year").val()+"-"+$("#month").val()+"-"+$("#day").val();
					$('#btn-date').data({date: date});
					$('#btn-date').datepicker('update');
				})
				.on('changeDate', function(ev){
					$('#btn-date').datepicker('hide');
					
					var date = new Date(ev.date);
					$("#year").select2("val", date.getFullYear());
					$("#month").select2("val", date.getMonth()+1);
					$("#day").select2("val", date.getDate());
				});
			
			/* setting untuk tempat lahir */
			$("#btn-edit-lahir").click(function(){
				App.loadProvinsi("#tempat_lahir_prov");
				$("#tempat_lahir_kota").select2({
					placeholder: "Pilih Kab./Kota",
					data : []
				});
				$(".label-tempat-lahir").remove();
				$("#tempat_lahir_prov")
				.on("change", function(e) { 
					App.loadKota("#tempat_lahir_kota",e.val);
				})
			})
			
			/* -----------  end tempat lahir --*/
			
			/* setting untuk alamat */
			for(var i=0;i<2;i++){
				$("#btn-edit-alamat_"+i).click(function(){
					var x =$(this).attr("id").replace("btn-edit-alamat_","");
					$(".label-alamat_"+x).remove();
					App.loadProvinsi("#provinsi_"+x);
					$("#provinsi_"+x)
					.on("change", function(e) {
						var x = $(this).attr('id').split("_");
						
						App.loadKota("#kabupaten_"+x[1],e.val);
						$("#kabupaten_"+x[1])
						.on("change", function(e) {
							var x = $(this).attr('id').split("_");
							var prov = $("#provinsi_"+x[1]).val();
							App.loadKecamatan("#kecamatan_"+x[1],prov,e.val);
							$("#kecamatan_"+x[1])
							.on("change", function(e) {
								var x = $(this).attr('id').split("_");
								var prov = $("#provinsi_"+x[1]).val();
								var kab = $("#kabupaten_"+x[1]).val();
								App.loadKelurahan("#kelurahan_"+x[1],prov,kab,e.val);
							})
						})
					})
				})
			}
			/*-------- end alamat --------*/

			$("#address-1").click(function(){
				if($(this).is(":checked")){
					$(".index_1").slideUp();
				}else{
					$(".index_1").slideDown();
				}
			})
			
			/* ------- Primary office ---------- */
			$("#btn-edit-office").click(function(){
				$(".label-office").remove();
				App.loadProvinsi("#kantor_provinsi");
				$("#kantor_provinsi")
				.on("change", function(e) {
					App.loadKota("#kantor_kabupaten",e.val);
					$("#kantor_kabupaten")
					.on("change", function(e) {
						var prov = $("#kantor_provinsi").val();
						App.loadKecamatan("#kantor_kecamatan",prov,e.val);
						$("#kantor_kecamatan")
						.on("change", function(e) {
							var prov = $("#kantor_provinsi").val();
							var kab = $("#kantor_kabupaten").val();
							App.loadKelurahan("#kantor_kelurahan",prov,kab,e.val);
						})
					})
				})
			})
			/* ---------------- end primary ------ */
			
			/* setting untuk tempat praktek */
			for(var i=1;i<4;i++){
				$("#btn-edit-office2_"+i).click(function(){
					var x =$(this).attr("id").replace("btn-edit-office2_","");
					$(".label-office2_"+x).remove();
					App.loadProvinsi("#kantor-provinsi_"+x);
					$("#kantor-provinsi_"+x)
					.on("change", function(e) {
						var x = $(this).attr('id').split("_");
						
						App.loadKota("#kantor-kabupaten_"+x[1],e.val);
						$("#kantor-kabupaten_"+x[1])
						.on("change", function(e) {
							var x = $(this).attr('id').split("_");
							var prov = $("#kantor-provinsi_"+x[1]).val();
							App.loadKecamatan("#kantor-kecamatan_"+x[1],prov,e.val);
							$("#kantor-kecamatan_"+x[1])
							.on("change", function(e) {
								var x = $(this).attr('id').split("_");
								var prov = $("#kantor-provinsi_"+x[1]).val();
								var kab = $("#kantor-kabupaten_"+x[1]).val();
								App.loadKelurahan("#kantor-kelurahan_"+x[1],prov,kab,e.val);
							})
						})
					})
				})
			}
			/*-------- end alamat --------*/
		}
	}
}();

$(document).ready(function(){
	FormMemberEdit.init();
})